<template>
  <div id="app">
    <Top />
    <Left />
    <div class="right">
      <router-view />
    </div>
  </div>
</template>
<script>
import Left from "@/components/left/index.vue";
import Top from "@/components/top/index.vue";
export default {
  name: "App",
  components: {
    Left,
    Top,
  },
  //数据持久化
  created() {
    window.addEventListener("beforeunload", () => {
      sessionStorage.setItem("store", JSON.stringify(this.$store.state));
    });
    if (sessionStorage.getItem("store")) {
      this.$store.replaceState(JSON.parse(sessionStorage.getItem("store")));
    }
  },
};
</script>
<style>
*{
  padding:0;
  margin:0;
}
html,body{
  width:100%; 
  height:100%;
}
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  height: 100%;
  overflow:hidden;
}
.right {
  float: left;
  width: calc(100% - 230px);
  height: 660px;
}
.left {
  float: left;
}
</style>
